<template>
	<view class="">
		<u-sticky bgColor="#fff">
			<view class="dingbu">
				<view class="" :style="{paddingTop:menutop+'rpx'}">
					<view class="">
						<view class="ershiba xiaocheng">
							<text class="ershiba xiaolv">青呼我为</text>
						</view>
					</view>
					<view class="margin_top flexright xiaocheng ershiba" @click="jumpurl('/pages/wode/wode')">
						<u-icon name="account-fill" size="18" color="#FF4B24"></u-icon><text>我的</text>
					</view>
					<!-- <view class="flexbetween margin_top">
						<view class="flexleft"
							style="padding:15rpx 30rpx;background: #FFFFFF;border-radius: 12rpx;border: 1rpx solid #FFFFFF;width: 65%;">
							<view class="margin_right1">
								<u-icon name="search" size="28"></u-icon>
							</view>
							<input placeholder="输入关键词" type="text" />
						</view>
						<view class="flexright">
							<image style="width: 25rpx;height: 26rpx;margin-right: 6rpx;"
								src="../../static/image/system/jb.png" mode="">
							</image>
							<view class="strongtext xiaohei">青统币:
								<text class="titletext xiaohei ">107</text>
							</view>
						</view>
					</view> -->
				</view>
			</view>
		</u-sticky>
		<!-- 轮播图 -->
		<view class="mainpadding" style="padding-bottom: 150rpx;">
			<!-- <image :src="list1.image_text" mode="" @click="lbtclick(list1)" class="radius" style="width: 100%;height:  280rpx;"></image> -->
			<u-swiper :list="list1" imgMode="widthFix" keyName="image_text" height="140" indicator circular
				@click="lbtclick($event)"></u-swiper>
			<!-- 近期活动 -->
			<view class="">
				<view class="flexbetween margin_top" @click="jumpurl('/pages/qingzixun/fengcailist')">
					<view class="flexleft">
						<view class="allline margin_right1"></view>
						<view class="sanshier xiaohei">近期活动</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view>
				<scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll">
					<view id="demo1" class="scroll-view-item_H uni-bg-red" v-for="item in hdList" :key="item.id"
						@click="jumpdetail('/pages/qingzixun/system?id=',item.id)">
						<view class="margin_top margin_right3">
							<view class="mainpadding2s ffffff radius">
								<image style="width: 100%;height: 134rpx;" :src="item.image_text" mode=""></image>
								<view class="titletext xiaohei margin_top2 fonweight xiankuan">{{item.name}}</view>
								<view class="ershil xiaohui margin_top1">{{item.createtime_text}}</view>
							</view>
						</view>
					</view>
				</scroll-view>
			</view>
			<!-- 最新政策 -->
			<view class="">
				<view class="flexbetween margin_top" @click="jumpurl('/pages/qingzixun/zhengce')">
					<view class="flexleft">
						<view class="allline margin_right1"></view>
						<view class="sanshier xiaohei">最新政策</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view>
				<view class="mainpadding ffffff radius margin_top" v-for="item in zcList" :key="item.id"
					@click="jumpdetail('/pages/qingzixun/gonggaoxq?id=',item.id)">
					<view class="flexleft">
						<view class="margin_right1"
							style="width: 12rpx;height: 12rpx;background: #05AD34;border-radius: 50%;"></view>
						<view class="sanshier xiaohei yhxk">{{item.name}}</view>
					</view>
				</view>
			</view>
			<!-- 青年驿站 -->
			<view class="" @click="jumpurl('/pages/qingzixun/qingnianyzxq')">
				<view class="flexbetween margin_top">
					<view class="flexleft">
						<view class="allline margin_right1"></view>
						<view class="sanshier xiaohei">{{bottommsg.qingnianyz_name}}</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view>
				<view class="margin_top">
					<image :src="bottommsg.qingnianyz_image" class="radius" style="width: 100%;height: 280rpx;" mode="">
					</image>
				</view>
			</view>
			<!-- <view class="" @click="xiaochengxu()">
				<view class="flexbetween margin_top">
					<view class="flexleft">
						<view class="allline margin_right1"></view>
						<view class="sanshier xiaohei">{{bottommsg.qingnianyz_name}}</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view>
				<view class="margin_top">
					<image :src="bottommsg.qingnianyz_image" class="radius" style="width: 100%;height: 280rpx;" mode=""></image>
				</view>
			</view> -->
			<!-- <view class="" @click="jumpdetail('/pages/qingzixun/system?id=',item.id)" v-for="item in fcList" :key="item.id">
				<view class="flexbetween margin_top">
					<view class="flexleft">
						<view class="allline margin_right1"></view>
						<view class="sanshier xiaohei">{{item.name}}</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view>
				<view class="margin_top">
					<image :src="item.image_text" class="radius" style="width: 100%;height: 280rpx;" mode=""></image>
				</view>
			</view> -->
			<!-- <view class="" @click="jumpdetail('/pages/qingzixun/fengcai?text=',bottommsg.qiyejiafc_name)">
				<view class="flexbetween margin_top">
					<view class="flexleft">
						<view class="allline margin_right1"></view>
						<view class="sanshier xiaohei">{{bottommsg.qiyejiafc_name}}</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view>
				<view class="margin_top">
					<image :src="bottommsg.qiyejiafc_image" class="radius" style="width: 100%;height: 280rpx;" mode=""></image>
				</view>
			</view> -->
			<!-- 知识竞答 -->
			<!-- <view class="">
				<view class="flexbetween margin_top">
					<view class="flexleft">
						<view class="allline margin_right1"></view>
						<view class="sanshier xiaohei">知识竞答</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view>
				<view class="margin_top mainpadding ffffff radius dingwei">
					<view class="flexleft">
						<image class="margin_right2" style="width: 230rpx;height: 168rpx;" src="../../static/logo.png"
							mode=""></image>
						<view class="" style="width: 50%;">
							<view class="sanshier xiaohei fonweight">生活小妙招知识竞答</view>
							<view class="ershil xiaohui margin_top1">奖励:200青统币</view>
							<view class="ershil xiaohui margin_top1">截止时间:2024年03月22日(还有3天截止)</view>
						</view>
					</view>
					<view class="flexleft margin_top">
						<view class="ershil xiaohui margin_right1">参与人:</view>
						<view class="flexleft">
							<image class="margin_right1" style="width: 44rpx;height: 44rpx;border-radius: 50%;"
								src="../../static/logo.png" mode=""></image>
							<u-icon name="more-circle-fill" color="#333333" size="28"></u-icon>
						</view>
					</view>
					<view class="ljbtn flexcenter">
						<view class="" style="word-break: break-all; width: 52rpx;">立即报名 </view>
					</view>
				</view>
			</view> -->
		</view>
		<tabbar :current="0"></tabbar>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				menutop: 0,
				list1: {},
				bottommsg: {},
				zcList: [],
				hdList: [],
				fcList: []
			}
		},
		onLoad() {
			uni.hideTabBar()
			// #ifdef MP-WEIXIN
			this.menutop = uni.getMenuButtonBoundingClientRect().top * 2
			// #endif
			// #ifdef H5
			uni.setStorageSync("token", "a50090e2-40bd-412a-b193-0ba0b631c3a9")
			uni.setStorageSync("user_id", "2")
			console.log(uni.getStorageSync("token"));
			// #endif
			this.getbanner()
			this.getbottommsg()
			this.zhengce()
			this.huodong()
			this.fengcai()
		},
		onShareAppMessage: function(options) {
			return {
				title: '青年汇',
				imageUrl: '',
				path: '/pages/qingzixun/qingzixun'
			}
		},
		onShareTimeline: function() {
			return {
				title: '青年汇',
				imageUrl: '',
				path: '/pages/qingzixun/qingzixun'
			}
		},
		methods: {
			lbtclick(val) { //点击轮播图
				// console.log(val)
				// return false;
				uni.navigateTo({
					url: "/pages/qingzixun/lbtxq?id=" + this.list1[val].id
				})
			},
			xiaochengxu() {
				let that = this
				if (!that.bottommsg.wechat_appid) {
					httpRequest.toast("建设中")
					return false
				}
				uni.navigateToMiniProgram({
					appId: that.bottommsg.wechat_appid, // 小程序的appid
					path: that.bottommsg.wechat_path, // 打开的页面路径，可选
					extraData: {
						// 需要传递给小程序的数据，可选
					},
					success(res) {
						// 打开成功的回调，可选
						console.log('打开成功');
					},
					fail(err) {
						// 打开失败的回调，可选
						console.log('打开失败', err);
					}
				});
			},
			huodong() {
				httpRequest.request('/api/index/qyfcIndex', 'POST', {
					page: 1,
					limit: 3,
					type: 2
				}).then(res => {
					this.hdList = res.data.data
				}).catch(err => {})
			},
			fengcai() {
				httpRequest.request('/api/index/qyfcIndex', 'GET', {}).then(res => {
					this.fcList = res.data.data
				}).catch(err => {})
			},
			zhengce() { //获取最新政策
				httpRequest.request('/api/index/noticeIndex', 'POST', {
					page: 1,
					limit: 3,
					type: 1
				}).then(res => {
					this.zcList = res.data.data
				}).catch(err => {})
			},
			getbanner() { //获取轮播图
				httpRequest.request('/api/index/getAdvertiseList', 'POST', {
					advertise_position_id: 1,
					is_more: 1
				}).then(res => {
					this.list1 = res.data
				}).catch(err => {})
			},
			getbottommsg() { //获取轮播图
				httpRequest.request('/api/index/getConfigInfo', 'POST', {}).then(res => {
					this.bottommsg = res.data
				}).catch(err => {})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.ljbtn {
		position: absolute;
		right: 24rpx;
		bottom: 30rpx;
		width: 88rpx;
		height: 88rpx;
		font-weight: 500;
		font-size: 26rpx;
		color: #FFFFFF;
		background: linear-gradient(321deg, #FF8D4D 0%, #FF3D00 100%);
		box-shadow: 4rpx 4rpx 4rpx 0rpx rgba(255, 51, 51, 0.15);
		border-radius: 20rpx 20rpx 20rpx 20rpx;
	}

	.dingbu {
		padding: 0 30rpx 30rpx;
		background-size: 100% 100%;
		width: 100%;
		box-sizing: border-box;
		background-image: url('../../static/image/system/toub.png');
	}
</style>